<%@page contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description"
	content="Starter files for implementing Twitter Bootstrap's Carousel -- using Bootstrap version 2.0.4">
<meta name="author" content="David Cochran for webdesign.tutsplus.com">
<title>우리끼리에 오신 것을환영합니다</title>
<meta name="description"
	content="Circle Hover Effects with CSS Transitions" />
<meta name="keywords"
	content="circle, border-radius, hover, css3, transition, image, thumbnail, effect, 3d" />
<meta name="author" content="Codrops" />
<link rel="stylesheet" type="text/css" href="../css/common.css" />
<link rel="stylesheet" type="text/css" href="../css/style2.css" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,700'
	rel='stylesheet' type='text/css' />
<script type="text/javascript" src="../js/modernizr.custom.79639.js"></script>
<!--[if lte IE 8]><style>.main{display:none;} .support-note .note-ie{display:block;}</style><![endif]-->
<link href="../css/bootstrap.css" rel="stylesheet">
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="../js/jquery-1.7.2.min.js"><\/script>')</script>
<!-- Bootstrap jQuery plugins compiled and minified -->
<script src="../js/bootstrap.min.js"></script>
<script>
      $(document).ready(function(){
        $('.carousel').carousel({
          interval: 4000
        });
      });
</script>
<script type="text/javascript">
		function searchCheck(){
			if(document.search.keyWord.value==''){
				alert('검색어를 입력하세요.');
				document.search.keyWord.focus();
				return false;
			}
		}
</script>
</head>
<body>
	<!-- 배너 슬라이더 시작====================================================================== -->
	<div class="container">
		<div id="this-carousel-id" class="carousel slide">
			<div class="carousel-inner">
				<div class="item active">
					<a href="#"> <img src="../images/sl-1.jpg"
						alt="Antennae Galaxies" />
					</a>
					<div class="carousel-caption">
						<p>페션 센스가 돋보여!</p>
						<p>
							<a href="#">시즌 오프 특가! &raquo;</a>
						</p>
					</div>
				</div>
				<div class="item">
					<a href="#"> <img src="../images/sl-2.jpg"
						alt="Carina Caterpillar" />
					</a>
					<div class="carousel-caption">
						<p>여름만큼 기다린 마지막 찬스</p>
						<p>
							<a href="#">미니샾 썸머 클리어런스</a>
						</p>
					</div>
				</div>
				<div class="item">
					<a href="#"> <img src="../images/sl-3.jpg" alt="Light Echo" />
					</a>
					<div class="carousel-caption">
						<p>한 여름 산타 특가</p>
						<p>
							<a href="#">패션 슈퍼 딜</a>
						</p>
					</div>
				</div>
				<div class="item">
					<a href="#"> <img src="../images/sl-4.jpg" alt="Galaxy NGC5866" />
					</a>
					<div class="carousel-caption">
						<p>키즈 여름 패션 시즌 오프</p>
						<p>
							<a href="#">키즈 여름 패션</a>
						</p>
					</div>
				</div>
				<div class="item">
					<a href="#"> <img src="../images/sl-5.jpg" alt="Galaxy NGC5866" />
					</a>
					<div class="carousel-caption">
						<p>센스 있는 엄마들의 쇼핑 기준!!</p>
						<p>
							<a href="#">시원시원한 아이의 여름을 위해</a>
						</p>
					</div>
				</div>
				<div class="item">
					<a href="#"> <img src="../images/sl-6.jpg" alt="Galaxy NGC5866" />
					</a>
					<div class="carousel-caption">
						<p>공유기, 키보드, 마우스 세트와 7% 할인!</p>
						<p>
							<a href="#">레노버가 쿨하게 쏜다</a>
						</p>
					</div>
				</div>
			</div>
			<!-- .carousel-inner -->
			<!--  next and previous controls here
              href values must reference the id for this carousel -->
			<a class="carousel-control left" href="#this-carousel-id"
				data-slide="prev">&lsaquo;</a> <a class="carousel-control right"
				href="#this-carousel-id" data-slide="next">&rsaquo;</a>
		</div>
		<!-- 배너 슬라이더 끝====================================================================== -->
		<!-- 상품 리스트 출력====================================================================== -->
	</div>
	
	<form action="prolist.do" name="prolist" method="get">
		<table>
			<tr>
				<c:forEach var="article" items="${list}">
					<td>
						<div class="container2">
							<section>
								<ul class="ch-grid">
									<li style="background-image: url(../adminproductupload/${article.p_listimage});">
										<div class="ch-item">
											<div class="ch-info">
												<c:if test="${article.p_amount > 0}">
												<br><br><br><br><br><br><br>
												${article.p_name}<br>
												<input type="button" onclick="location.href='detailPro.do?p_code=${article.p_code}'" value="상세 보기">
													<br>수량 : ${article.p_amount} 개
												</c:if>
												<c:if test="${article.p_amount < 0}">
												<br><br><br><br><br>
													<b>
													죄송합니다.<br> 
													현재 판매 중인 상품이 매진 되었거나<br> 
													기간이 만료되어 판매가 종료되었습니다.<br>
													구매해주신 분들 감사합니다<br>
													</b>
													<input type="button" class="buyend" value="판매 종료">
												</c:if>
											</div>
										</div>
									</li>
								</ul>
							</section>
						</div>
					<c:if test="${number%5 == 1}">
						<tr>
							<td></td>
						</tr>
					</c:if>
				</c:forEach>
			</tr>
			<c:if test="${count == 0 }">
				<tr align="center">
					<td colspan="6">등록된 상품이 없습니다.</td>
				</tr>
			</c:if>
		</table>
		<br>
		<br>
		<br>
		<div id=pageU align="center">${pagingHtml}</div>
	</form>
	<!-- 화면에 따라 다니는 탑버튼====================================================================== -->
	<a	style="display: scroll; position: fixed; bottom: 150px; right: 50px;"
		href="#" title="맨 위로"> <img width="50px" height="50px"
		src="http://cfs10.tistory.com/image/1/tistory/2008/10/29/19/12/4908370057f9b">
	</a>
</body>
</html>
